<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Hello MUI</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <!--标准mui.css-->
    <link rel="stylesheet" href="css/mui.min.css">
    <link rel="stylesheet" href="css/first-wpy.css">
    <!--App自定义的css-->
    <!--<link rel="stylesheet" type="text/css" href="../css/app.css" />-->
    <style>
        div::-webkit-scrollbar {
            height: 0;
        }

        .mui-card .mui-control-content {
            padding: .5rem;
        }

        .mui-control-content {
            height: 7.5rem;
        }

        .mui-segmented-control {
            background-color: #fff !important;
            overflow: auto;
            width: 100%;
            border-radius: .15rem;
            display: flex;
            border: 0px;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 555;
            border-bottom: .05rem solid #f5f5f5 !important;
        }

        .mui-segmented-control .mui-control-item {
            overflow: initial;
            flex-shrink: 0;
            line-height: 1.9rem;
            display: block;
            width: 25%;
            border: 0px;
        }

        .mui-segmented-control .mui-control-item.mui-active {
            color: #e41111;
            background-color: #fff;
            border-bottom: .1rem solid red;
            color: #000;
            font-size: .85rem;
        }

        .mui-segmented-control .mui-control-item {
            flex-shrink: 0;
            line-height: 1.9rem;
            display: block;
            width: 25%;
            color: #6c7076;
            font-size: 0.75rem;
        }
    </style>
</head>

<body>
    <div class="mui-content">
        <div>
            <div id="segmentedControl" class="mui-segmented-control">
                <a class="mui-control-item mui-active" href="#item1">推荐</a>
                <a class="mui-control-item" href="#item2">新品</a>
                <a class="mui-control-item" href="#item3">3C配件</a>
                <a class="mui-control-item" href="#item4">手办公仔</a>
                <a class="mui-control-item" href="#item5">潮玩盲盒</a>
                <a class="mui-control-item" href="#item6">生活服饰</a>
                <a class="mui-control-item" href="#item7">影城爆品</a>
                <a class="mui-control-item" href="#item8">3D眼镜</a>
                <a class="mui-control-item" href="#item9">毛绒公仔</a>
                <a class="mui-control-item" href="#item10">电影原著</a>
            </div>
        </div>
        <div>
            <div id="item1" class="mui-control-content mui-active">
                <div id="scroll" class="mui-wrapper">
                    <div class="mui-scroll">
                        <div class="all">
                            <div class="centre">
                                <div class="search" onclick="a(3)" >
                                    <a href="#" style="display: flex; align-items: center;">
                                    <img src="https://p1.meituan.net/scarlett/6805a0ea99bf9ca3d45750c3d8665412950.png"
                                        alt="">
                                    <span>漫威</span>
                                </a> 
                                </div>
                                <div class="carousel">
                                    <div class="mui-slider">
                                        <div class="mui-slider-group mui-slider-loop">
                                            <!--支持循环，需要重复图片节点-->
                                            <div class="mui-slider-item mui-slider-item-duplicate" onclick="a(1)">
                                                <a href="#"><img
                                                        src="https://p0.meituan.net/movie/6fdc42ae8bb416ba2faf744eafcbe3d692407.png" /></a>
                                            </div>
                                            <div class="mui-slider-item" onclick="a(1)">
                                                <a href="#"><img
                                                        src="https://p0.meituan.net/movie/05801246b9616a6b68a1ecb45329249182377.jpg" /></a>
                                            </div>
                                            <div class="mui-slider-item" onclick="a(1)">
                                                <a href="#"><img
                                                        src="	https://p0.meituan.net/movie/ff298a4d66035924c3b7d6ee7128bc9581927.jpg" /></a>
                                            </div>
                                            <div class="mui-slider-item" onclick="a(1)">
                                                <a href="#"><img
                                                        src="	https://p1.meituan.net/movie/8552612619f6950ad56ba3ac600f6bd690560.jpg" /></a>
                                            </div>
                                            <div class="mui-slider-item" onclick="a(1)">
                                                <a href="#"><img
                                                        src="https://p0.meituan.net/movie/d3452476cbd6cd39070ec9da5e1ab292146332.jpg" /></a>
                                            </div>
                                            <div class="mui-slider-item" onclick="a(1)">
                                                <a href="#"><img
                                                        src="	https://p0.meituan.net/movie/6277f94b80c205d141009e1b7455477e102302.jpg" /></a>
                                            </div>
                                            <div class="mui-slider-item" onclick="a(1)">
                                                <a href="#"><img
                                                        src="https://p0.meituan.net/movie/6fdc42ae8bb416ba2faf744eafcbe3d692407.png" /></a>
                                            </div>
                                            <!--支持循环，需要重复图片节点-->
                                            <div class="mui-slider-item mui-slider-item-duplicate" onclick="a(1)">
                                                <a href="#"><img
                                                        src="https://p0.meituan.net/movie/05801246b9616a6b68a1ecb45329249182377.jpg" /></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="two-photo">
                                    <img src="https://p1.meituan.net/moviemachine/048d86e9abf1726a6a1fb9fc942cc72d59590.jpg@60q"
                                        alt="" onclick="a(0)">
                                    <img src="https://p0.meituan.net/moviemachine/7eafa541db0b314e7b6470c2ec576de772884.jpg@60q"
                                        alt="" onclick="a(0)">
                                </div>
                                <div class="Onmyoji">
                                    <div class="title">
                                        <p>阴阳师</p>
                                        <span>更多></span>
                                    </div>
                                    <div class="goods">
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥349
                                            </div>
                                        </div>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(https://p0.meituan.net/movie/a6ca0140beb479743be3a32cb1da36a4283313.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师崽崽扭蛋</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥35
                                            </div>
                                        </div>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(https://p0.meituan.net/movie/335339462d7b7fc5e46216aa90f6cdc1378405.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">平安物语Q版黏土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥188
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="Onmyoji">
                                    <div class="title">
                                        <p>火影忍者正版周边</p>
                                        <span>更多></span>
                                    </div>
                                    <div class="goods">
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(https://p0.meituan.net/movie/c8a0c4ef3ddff923373decfd89773f36440451.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">火影博人传正版铅笔伞</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥69
                                            </div>
                                        </div>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(	https://p0.meituan.net/movie/0ee487fd3e033a4a0d3642f4b2074479164457.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">火影博人传正版传承戒指</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥141
                                            </div>
                                        </div>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(	https://p0.meituan.net/movie/2eecb3ad9be70a8367650066e8765266132089.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">火影博人传正版智能保温杯</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥141
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="Onmyoji">
                                    <div class="title">
                                        <p>星迷宇宙</p>
                                        <span>更多></span>
                                    </div>
                                    <div class="goods">
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(https://p0.meituan.net/movie/477e4fbb54540e9abd010ba0a81dd1ac261336.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">星迷宇宙X重力星球｜机器人音箱</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥1599
                                            </div>
                                        </div>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(https://p1.meituan.net/movie/feb0b1b4f16654ff7858f6da48e8c5401127474.png@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">星迷宇宙盲盒收藏卡</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥60
                                            </div>
                                        </div>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:27vw;background-image:url(	https://p0.meituan.net/movie/8e796397821d952c5f8d20ab45d4c537266165.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">涛涛熊平沿帽</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                ¥99
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="store">
                                    <div class="like">
                                        你可能喜欢
                                    </div>
                                    <div class="menu">
                                        <ul>
                                            <li>
                                                <div class="mui-card" onclick="a(2)">
                                                    <div class="mui-card-header mui-card-media"
                                                        style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                                    </div>
                                                    <div class="mui-card-content">
                                                        <div class="mui-card-content-inner">
                                                            <p style="color: #333;">游戏人生空白戒指</p>
                                                        </div>
                                                    </div>
                                                    <div class="mui-card-footer">
                                                        <p> ¥199</p>
                                                        <span>¥278</span>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="mui-card" onclick="a(2)">
                                                    <div class="mui-card-header mui-card-media"
                                                        style="height:44vw;background-image:url(https://p0.meituan.net/movie/cb8143dabdf3a890d69816bbd9fbb89673432.jpg@348w_348h_2e)">
                                                    </div>
                                                    <div class="mui-card-content">
                                                        <div class="mui-card-content-inner">
                                                            <p style="color: #333;">爪爪猫国潮动漫真无线蓝牙耳机</p>
                                                        </div>
                                                    </div>
                                                    <div class="mui-card-footer">
                                                        <p> ¥139</p>
                                                        <span>¥199</span>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                        <ul>
                                            <li>
                                                <div class="mui-card">
                                                    <div class="mui-card-header mui-card-media"
                                                        style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                                    </div>
                                                    <div class="mui-card-content">
                                                        <div class="mui-card-content-inner">
                                                            <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                        </div>
                                                    </div>
                                                    <div class="mui-card-footer">
                                                        <p> ¥349</p>
                                                        <span>¥278</span>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="mui-card">
                                                    <div class="mui-card-header mui-card-media"
                                                        style="height:44vw;background-image:url(https://p0.meituan.net/movie/cb90c5b219b102d447824df436c98c4c67240.jpg@348w_348h_2e)">
                                                    </div>
                                                    <div class="mui-card-content">
                                                        <div class="mui-card-content-inner">
                                                            <p style="color: #333;">萌宠猫爪无线蓝牙耳机</p>
                                                        </div>
                                                    </div>
                                                    <div class="mui-card-footer">
                                                        <p> ¥99</p>
                                                        <span>¥169</span>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item2" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>最新上架</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                            <div>
                                <p>
                                    <span>销量排序</span>
                                </p>
                                <p>
                                    <span style="color: #f03d36;">最新上架</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">游戏人生空白戒指</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥199</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(	https://p0.meituan.net/movie/cb8143dabdf3a890d69816bbd9fbb89673432.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">爪爪猫国潮动漫真无线蓝牙耳机</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥139</p>
                                                <span>¥199</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card" onclick="a(2)">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item3" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item4" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item5" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item6" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item7" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item8" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item9" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="item10" class="mui-control-content">
                <div class="nav-two">
                    <div class="fold">
                        <p>销量排序</p>
                        <img src="https://p1.meituan.net/scarlett/927c9c2360347064e1317317cb145a73642.png" alt="">
                         <div>
                                <p>
                                    <span style="color: #f03d36;">销量排序</span>
                                    <img src="	https://p0.meituan.net/scarlett/06821b6e8745c5ec91dad3159d6e79d6381.png"
                                        alt="">
                                </p>
                                <p>
                                    <span>最新上架</span>
                                </p>
                                <p>
                                    <span>价格由低到高</span>
                                </p>
                                <p>
                                    <span>价格由高到低</span>
                                </p>
                            </div>
                    </div>
                    <div class="fold-two">
                        <p>筛选</p>
                        <img src="https://p0.meituan.net/scarlett/c03b09c98ad4a6a9cf68896a2a86e4bf621.png" alt="">
                    </div>
                </div>
                <div class="all">
                    <div class="centre" style="margin-top: 5.1rem;">
                        <div class="store">
                            <div class="menu">
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/e89acd90a2ef9cd9b720b52be6a45ceb134739.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="mui-card">
                                            <div class="mui-card-header mui-card-media"
                                                style="height:44vw;background-image:url(https://p0.meituan.net/movie/ca0fcdcaf9334f61ccf3b31d2275424c161996.jpg@348w_348h_2e)">
                                            </div>
                                            <div class="mui-card-content">
                                                <div class="mui-card-content-inner">
                                                    <p style="color: #333;">阴阳师大天狗粘土手办</p>
                                                </div>
                                            </div>
                                            <div class="mui-card-footer">
                                                <p> ¥349</p>
                                                <span>¥278</span>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="js/mui.min.js"></script>
    <script>
        //获得slider插件对象
        var gallery = mui('.mui-slider');
        gallery.slider({
            interval: 1000//自动轮播周期，若为0则不自动播放，默认为0；
        });
        // 在iphone6 375宽度中  html是以20px作为基本单位
        (function () {
            function w() {
                var all = document.documentElement;  // 获取html元素
                var test = all.getBoundingClientRect().width;  // 获取当前设备的宽度、
                //             console.log(123,test)
                if (test > 1024) {
                    test = 1024;
                }
                rem = test / 18.75;
                console.log(rem)
                all.style.fontSize = rem + 'px'
            }
            w();
            window.addEventListener("resize", function () {
                w()
            }, false)
        })();
        mui.init({
            swipeBack: true //启用右滑关闭功能
        });
        (function ($) {
            $('#scroll').scroll({
                indicators: true //是否显示滚动条
            });
            var segmentedControl = document.getElementById('segmentedControl');
            $('.mui-input-group').on('change', 'input', function () {
                if (this.checked) {
                    var styleEl = document.querySelector('input[name="style"]:checked');
                    var colorEl = document.querySelector('input[name="color"]:checked');
                    if (styleEl && colorEl) {
                        var style = styleEl.value;
                        var color = colorEl.value;
                        segmentedControl.className = 'mui-segmented-control' + (style ? (' mui-segmented-control-' + style) : '') + ' mui-segmented-control-' + color;
                    }
                }
            });
        })(mui);
        var arr = ["cat-eye-shopping.html", "shopping.html", "goods-details.html","search.html"];
    function a(i) {
        window.location.href = arr[i];
    }
    </script>

</body>

</html>